- page_title _("Blame"), @blob.path, @ref
- add_page_specific_style 'page_bundles/tree'
- blame_streaming_url = blame_pages_streaming_url(@id, @project)

- if @blame_mode.streaming? && @blame_pagination.total_extra_pages > 0
  - content_for :startup_js do
    = javascript_tag do
      :plain
        window.blamePageStream = (() => {
          const url = new URL("#{blame_streaming_url}");
          url.searchParams.set('page', 2);
          return fetch(url).then(response => response.body);
        })();
- dataset = { testid: 'blob-content-holder', qa_selector: 'blame_file_content', per_page: @blame_pagination.per_page, total_extra_pages: @blame_pagination.total_extra_pages - 1, pages_url: blame_streaming_url }

#blob-content-holder.tree-holder.js-per-page{ data: dataset }
  = render "projects/blob/breadcrumb", blob: @blob, blame: true

  .file-holder
    = render "projects/blob/header", blob: @blob, blame: true

    .file-blame-legend
      %span.left-label Newer
      %span.legend-box.legend-box-0
      %span.legend-box.legend-box-1
      %span.legend-box.legend-box-2
      %span.legend-box.legend-box-3
      %span.legend-box.legend-box-4
      %span.legend-box.legend-box-5
      %span.legend-box.legend-box-6
      %span.legend-box.legend-box-7
      %span.legend-box.legend-box-8
      %span.legend-box.legend-box-9
      %span.right-label Older

    .table-responsive.blame-table
      .blame-table-wrapper
        = render partial: 'page'

        - if @blame_mode.streaming?
          #blame-stream-container.blame-stream-container

    - if @blame_mode.pagination? && @blame_pagination.total_pages > 1
      .gl-display-flex.gl-justify-content-center.gl-flex-direction-column.gl-align-items-center.gl-p-3.gl-bg-gray-50.gl-border-t-solid.gl-border-t-1.gl-border-gray-100
        = render Pajamas::ButtonComponent.new(href: entire_blame_path(@id, @project), size: :small, button_options: { class: 'gl-mt-3' }) do |c|
          = _('Show full blame')

    - if @blame_mode.streaming?
      #blame-stream-loading.blame-stream-loading
        .gradient
        = gl_loading_icon(size: 'sm')
        %span.gl-mx-2
          = _('Loading full blame...')

  - if @blame_mode.pagination?
    = paginate(@blame_pagination.paginator, theme: "gitlab")
